@keyframes grow {  0% {   width: var(--prog-h);  }   100% {   width: var(--passung-value);  } }  .l-card.is-visible .passung__fill {  animation: grow 1s forwards;  width: var(--prog-h); }  .l-card.is-visible .passung__value-triangle {  animation: changeColor 0.5s forwards 1s;  opacity: 0; }  .l-card.is-visible .passung__value-label {  opacity: 0;  animation: changeColor 0.5s forwards 1s; }  @keyframes changeColor {  0% {   opacity: 0;  }   100% {   opacity: 1;  } }  @keyframes slideUpFade {  0% {   transform: translateY(20px);   opacity: 0;  }   60% {   opacity: 1;  }   100% {   transform: translateY(0);   opacity: 1;  } }  @keyframes popFade {  0% {   transform: translateY(10px) scale(1);   opacity: 0;  }   100% {   transform: translateY(0) scale(1);   opacity: 1;  } }  @keyframes introSlideUpFade {  0% {   transform: translateY(20px);   opacity: 0;  }   50% {   opacity: 0.9;  }   100% {   transform: translateY(0);   opacity: 1;  } }  .l-hero .l-hero__heading, .l-hero .l-hero__txt, .l-hero .c-hero__btn, .l-hero .hero__img, .l-hero picture, .hero__img-inner-wrap::before {  opacity: 0;  transform: translateY(20px); }  .l-hero.is-visible .l-hero__heading {  animation: slideUpFade 560ms ease-in-out forwards;  animation-delay: 0.05s; }  .l-hero.is-visible .l-hero__txt {  animation: slideUpFade 560ms ease-in-out forwards;  animation-delay: 0.12s; }  .l-hero.is-visible .hero__img, .l-hero.is-visible picture, .hero__img-inner-wrap::before {  animation: slideUpFade 560ms ease-in-out forwards;  animation-delay: 0.18s; }  .l-hero.is-visible .c-hero__btn {  animation: popFade 420ms ease-in-out forwards;  animation-delay: 0.24s; }   .c-intro__block, .l-intro, .l-intro .l-intro__img-wrap {  opacity: 0;  transform: translateY(20px); }   .c-intro__block, .l-intro__img-wrap, .l-intro {  animation: slideUpFade 560ms ease-in-out forwards }   .l-intro.is-visible .l-intro__block:nth-of-type(1) .c-intro__block .l-intro.is-visible .l-intro__img-wrap, .l-intro {  animation-delay: 0.05s; }  .l-intro.is-visible .l-intro__block:nth-of-type(2) .c-intro__block {  animation-delay: 0.23s; }  .l-intro.is-visible .l-intro__block:nth-of-type(3) .c-intro__block {  animation-delay: 0.47s; }  .l-intro.is-visible .l-intro__block:nth-of-type(4) .c-intro__block {  animation-delay: 0.77s; }  @media (max-width: 899.8px) {   .l-hero.is-visible .hero__img,  .hero__img-inner-wrap::before {   animation: slideUpFade 560ms ease-in-out forwards;   animation-delay: 0.02s;  }   .l-hero.is-visible .l-hero__heading {   animation: slideUpFade 560ms ease-in-out forwards;   animation-delay: 0.06s;  }   .l-hero.is-visible .l-hero__txt {   animation: slideUpFade 560ms ease-in-out forwards;   animation-delay: 0.13s;  }   .l-hero.is-visible .c-hero__btn {   animation: popFade 420ms ease-in-out forwards;   animation-delay: 0.20s;  } }  @media (prefers-reduced-motion: reduce) {   .l-hero .l-hero__heading,  .l-hero .l-hero__txt,  .l-hero .hero__img,  .l-hero .c-hero__btn,  .l-hero .hero__img-inner-wrap::before,  .l-intro .c-intro__block-heading,  .l-intro .c-intro__block-txt,  .l-intro .c-intro__block,  .c-intro__block,  .l-intro__img-wrap, .l-intro,  .l-hero picture,   .passung__fill,  .passung__value-label,  .passung__value-triangle {   animation: none !important; transition: none !important; transform: none !important; opacity: 1 !important; will-change: auto !important;  }   .passung__fill {   width: var(--passung-value) !important;  } } *, *::before, *::after {   box-sizing: border-box; } * {   margin: 0;   padding: 0; }  input, button, textarea, select {   font: inherit; }  p, h1, h2, h3, h4, h5, h6 {   overflow-wrap: break-word; } button {   padding: 0;   border: none;   outline: none;   font: inherit;   color: inherit;   background: none }  input[type="checkbox"] {   -webkit-appearance: none;   appearance: none;   background-color: #fff;   margin: 0; }   :root {   --blue-50: hsl(244, 100%, 98%);   --blue-100: hsl(244, 100%, 95%);   --blue-200: hsl(244, 100%, 90%);   --blue-300: hsl(244, 100%, 85%);   --blue-400: hsl(244, 100%, 75%);   --blue-500: hsl(244, 100%, 65%);   --blue-600: hsl(244, 100%, 55%);   --blue-700: hsl(244, 100%, 45%);   --blue-800: hsl(244, 100%, 40%);   --blue-900: hsl(244, 100%, 35%);   --red-50: hsl(350, 100%, 98%);   --red-100: hsl(350, 100%, 95%);   --red-200: hsl(350, 100%, 90%);   --red-300: hsl(350, 100%, 85%);   --red-400: hsl(350, 100%, 80%);   --red-500: hsl(350, 75%, 50%);   --red-600: hsl(350, 75%, 45%);   --red-700: hsl(350, 75%, 40%);   --red-800: hsl(350, 75%, 35%);   --red-900: hsl(350, 75%, 30%); --grey-50: hsl(0, 0%, 98%);   --grey-100: hsl(0.00,0.00%,93.33%);   --grey-200: hsl(0.00,0.00%,87.84%);   --grey-300: hsl(0.00,0.00%,74.12%);   --grey-400: hsl(0.00,0.00%,61.96%);   --grey-500: #757575;   --grey-600: #616161;   --grey-700: hsl(0.00,0.00%,25.88%);   --grey-800: hsl(0.00,0.00%,12.94%);   --grey-900: hsl(0.00,0.00%,5%);  --main-color: var(--blue-500);   --main-color-o50: hsla(244, 100%, 65%, 50%);   --main-color-o75: hsla(244, 100%, 65%, 75%);   --filter-main-color: invert(13%) sepia(96%) saturate(6259%) hue-rotate(249deg) brightness(95%) contrast(114%); } :root {   --col-disabled: var(--grey-500);   --c-error: var(--red-500); } :root {   --fs-xxs: 1.4rem;   --fs-xs: 1.6rem;   --fs-s: 2rem;   --fs-m: 2.4rem;   --fs-l: 2.8rem;   --fs-xl:4rem;   --fs-xxl: 7.5rem;  --fs-hero-xl: 40px;   --fs-hero-m: 28px;   --fs-hero-l: 28px; --lh-xs: 1;   --lh-s: 1.2;   --lh-m: 1.5;   --bp-xs: 480px;   --bp-s: 576px;   --bp-m: 768px;   --pb-l: 1200px;   --pb-xl: 1440px;   --fs-logo:clamp(16px, calc(-11.429px + 8.571vw), 40px); } @media(max-width: 799.8px){   :root{  --fs-m: 2rem;  --fs-xl:3.5rem;   } } .txt--main-color {   color: var(--main-color); } .t-fs--xxs {   font-size: var(--fs-xxs); } .t-fs--xs {   font-size: var(--fs-xs); } .t-fs--s {   font-size: var(--fs-s); } .t-fs--m {   font-size: var(--fs-m); } .t-fs--l {   font-size: var(--fs-l); } .t-fs--xl {   font-size: var(--fs-xl);   margin-bottom: 0.5em;   letter-spacing: -1px;   line-height: 1; } .t-fs--xxl {   font-size: var(--fs-xxl);   letter-spacing: -1px;   line-height: 1; } .t-fs--m, .t-fs--m > p{   font-size: var(--fs-m);   margin-bottom: 0.5em; } .t-fw-s{   font-weight: 300; } .t-fw-sm{   font-weight: 400; } .t-fw-s{   font-weight: 800; } .t-fw-sm{   font-weight: 900; } p{   font-size: var(--fs-xs); } .t-ac{   text-align: center; } .t--underline{   text-decoration: underline; }  html {   font-size: 62.5%; } body {   font-family: 'Roboto Variable', sans-serif;   margin: 0;   padding: 0;   --mg-lr: clamp(30px, calc(-183.165px + 27.72vw), 216px);   --mx-w-hero-txt: 500px;   --w-card: 366px;   --pd-lr: 3rem; } * {   box-sizing: border-box !important; } *,button {   line-height: 1.3;  line-height: calc(2px + 2ex + 2px); } img {   max-width: 100%;   height: auto; } h1 {   margin-bottom: 1.5em; } strong {   margin-bottom: 0.5em; } #app {   display: flex;   align-items: center;   flex-direction: column; } button:focus-visible, a.focus-visible{   outline: 2px solid black;   outline-offset: 2px; } button:hover{   cursor: pointer; } h1:focus-visible{   outline: none; } * {   font-variant-ligatures: none;  } .img-copyr__caption {   place-self: end;   margin-right: 3%;   z-index: 6;   margin-bottom: 3%;   position: relative;  }   .img-copyr {   display: grid;  }   .img-copyr>* {   grid-row: 1;   grid-column: 1;  }   .img-copyr__details {   position: relative;  }   .img-copyr__details summary::marker {   content: '©';   font-size: 1.4rem;  }   .img-copyr__details p {   padding: 3px;   border-radius: 3px;   position: absolute;   background: white;   right: 0;   width: max-content;   max-width: 70vw;  } .no-list-style {   list-style: none;   padding: 0; } .txt--c-main {   color: var(--main-color) }  .hidden {   display: none !important; } .u-bottom-line {   border-bottom: 1px solid var(--grey-300); } .u-bottom-line ul li:last-child {   padding-bottom: 1rem; }  :root {   --box-shadow-z1: 0 1px 4px 0 hsla(0, 0%, 0%, 0.37);   --box-shadow-z2: 0 2px 2px 0 hsla(0, 0%, 0%, 0.2), 0 6px 10px 0 hsla(0, 0%, 0%, 0.3);   --box-shadow-z3: 0 11px 7px 0 hsla(0, 0%, 0%, 0.19), 0 13px 25px 0 hsla(0, 0%, 0%, 0.3);   --box-shadow-z4: 0 14px 12px 0 hsla(0, 0%, 0%, 0.17), 0 20px 40px 0 hsla(0, 0%, 0%, 0.3);   --box-shadow-z5: 0 17px 17px 0 hsla(0, 0%, 0%, 0.15), 0 27px 55px 0 hsla(0, 0%, 0%, 0.3); } @media (max-width: 799.8px) {   .hide-below-800 {  display: none !important;   } } @media (min-width: 700px) {   .u-sr-only-above-700 {  border: 0;  clip: rect(0, 0, 0, 0);  clip-path: inset(50%);  width: 1px;  height: 1px;  padding: 0;  margin: -1px;  overflow: hidden;  position: absolute;  white-space: nowrap;   } } @media (min-width: 800px) {   .hide-above-800 {  display: none !important;   }   .u-sr-only-above-700 {  border: 0;  clip: rect(0, 0, 0, 0);  clip-path: inset(50%);  width: 1px;  height: 1px;  padding: 0;  margin: -1px;  overflow: hidden;  position: absolute;  white-space: nowrap;   } } @media (max-width: 899.8px) {   .hide-below-900 {  display: none !important;   } } @media (min-width: 900px) {   .hide-above-900 {  display: none !important;   } } .u-only-de {   display: none; } html[lang="de"] .u-only-de {   display: block; } .u-bg-container{   --bg-h: 100vh;   --bg-w:100vw;   --bg-color: var(--blue-100);   position: relative;   display: grid; } .u-bg-container--startpage{   --bg-h: 100%;   --bg-color: linear-gradient(180deg, hsla(0, 0%, 100%, 0.2) 0%, hsla(244, 100%, 64.9%, 0.2) 50%, hsla(0, 0%, 100%, 0.2) 100%);   --bg-w: Min(100vw, 170rem); } @media(min-width: 1700px){   .u-bg-container--startpage {   --bg-h: 110%;  --bg-color: radial-gradient(ellipse,var(--blue-300) 0%, var(--blue-100) 40%, transparent 70%);   } }  .u-bg-container > * {   z-index: 1; } .u-bg-container::before {   justify-self: center;   position: absolute;   content: ''; bottom: 0;   background: var(--bg-color);   width: var(--bg-w);   height: var(--bg-h); }  .icon-choice {   --icon-size: 1.4em;   --tt-color: var(--main-color);   --tt-color-secundary: var(--grey-300);   width: var(--icon-size);   height: var(--icon-size);   display: flex;   justify-content: center;   align-items: center;   padding: 0px;   margin: 0px;   border-radius: 50%;   aspect-ratio: 1/1; } .icon-choice--yes {   background: green; } .icon-choice--yes::before {   --icon-font-size: calc(var(--icon-size) * 0.7);  content: '✓';   color: white;   font-size: var(--icon-font-size); } .icon-choice--neutral {   border: solid calc(var(--icon-size) * 0.2) orange;  background-color: white; } .icon-choice--no {   background: red; } .icon-choice--no::before {   --icon-font-size: calc(var(--icon-size) * 0.7);  content: "X";   color: white;   font-size: var(--icon-font-size); }  .icon-choice--shadow {   box-shadow: var(--box-shadow-z3); }  .filter-icon {   height: var(--tt-btn-size);   width: var(--tt-btn-size);   height: 1.2em;   width: 1.2em;   --tt-color: var(--main-color);   --tt-color-secundary: var(--grey-300);   display: inline-flex;   justify-content: center;   align-items: center;   border: 2px solid var(--tt-color);   background-color: var(--tt-color-secundary);   border-radius: 7px; }   .filter-icon__img {   height: 0.8em;   width: 0.8em;   height: 76%;   width: 76%; }  .filter-icon--21 {   --tt-color: hsl(339, 67%, 51%);   --tt-color-secundary: hsl(339, 40%, 92%); } .tt-21{   --tt-color: hsl(339, 67%, 51%);   --tt-color-secundary: hsl(339, 40%, 92%); }  .filter-icon--22 {   --tt-color: hsl(244, 100%, 65%);   --tt-color-secundary: hsl(244, 49%, 93%); }  .tt-22{   --tt-color: hsl(244, 100%, 65%);   --tt-color-secundary: hsl(244, 49%, 93%); } .dropdown {   position: relative; } .cmb__btn {   --sum-arrow-w: 1.3em;   --sum-arrow-ratio: 23 / 11; } .cmb__box {   position: relative;   display: inline-block;   max-width: 100%; } .cmb__option-txt {   display: inline-flex;   align-items: center;   gap: 0.5em;   justify-content: space-between;   flex-grow: 1;   direction: ltr;   text-align: left; } .cmb__option-txt .icon-choice {   box-shadow: none; } .cmb__options:has(li), .cmb__options:has(fieldset) {   position: absolute;   background: white;   z-index: 9;   width: 100%;   box-shadow: var(--box-shadow-z3);   border-radius: 6px;   border: 2px solid var(--grey-400);   margin-top: 5px; } .cmb__options .cmb__option-txt {   padding-left: 1em;   padding-right: 0.3em; } .cmb__btn {   display: flex;   justify-content: space-between;   align-items: center;   width: 100%;   padding: 0.475em 1em;   border: 2px solid var(--grey-400);   cursor: pointer;   border-radius: 0.8em; } .cmb__btn[aria-expanded='true'] .cmb__value::after {   rotate: 0deg;   filter: brightness(0); } .cmb__btn--filter:hover .cmb__value::after {   filter: brightness(100); } .cmb__btn--filter:active {   background-color: var(--grey-700); } .cmb__btn:focus-visible {   outline: 2px solid black;   outline-offset: 2px; } .cmb__btn:hover {   background: var(--blue-200);   border-color: var(--blue-300); } .cmb__btn:active {   background: var(--blue-100);   border-color: var(--blue-200); } .cmb__option:focus-visible {   outline: 2px solid black; } .cmb__value {   display: grid;   align-items: center;   grid-auto-flow: column;   gap: 0.5em;   justify-content: space-between;   width: 100%;   display: flex;   text-align: left; } .cmb__btn--filter {   background-color: var(--grey-200);   transition: background-color 0.3s ease, color 0.3s ease;   height: 100%; } .cmb__btn--filter:hover {   background-color: black;   color: white;   border-color: black; } .cmb__value--language {   grid-template-columns: auto 1fr auto;   min-width: 10em;   padding: 0.1rem 0.6rem; } .cmb__value--language::before {   content: '';   height: 1.1em;   background: url('../img/language.svg');   background-size: contain;   background-repeat: no-repeat;   aspect-ratio: 1/1; } .cmb__option-txt--language {   display: inline; } .cmb__option-txt--language-mobil {   width: 2.5ch; } .cmb__value .cmb__option-txt--language-mobil {   display: none; } @media (max-width: 799.8px) {   .cmb__btn--filter:hover {  background-color: black;  color: white;  border-color: black;   }   .cmb__value .cmb__option-txt--language {  display: none;   }   .cmb__value .cmb__option-txt--language-mobil {  display: inline;  gap: 0px;  justify-content: revert-layer;  text-align: left;   }   ul.cmb__options--language {  width: max-content ;  right: 0;   }   .cmb__options .cmb__options-txt {  padding-left: 0;  padding-right: 0;   }   .cmb__value--language {  min-width: unset;  display: flex;  justify-content: space-between; gap: 3px;   }   .cmb__value.cmb__value--language::after {  margin-left: 0;  width: 1rem;   }   .cmb__value.cmb__value--language::before {  height: 1.3em;   } } .cmb__btn--language {   padding: 0.175em 0.6em; } .cmb__value::after {   content: '';   rotate: 180deg;   width: var(--sum-arrow-w);   background: url('../img/collapse.svg');   background-size: auto;   background-size: cover;   transition: 0.2s;   flex-shrink: 0;   aspect-ratio: var(--sum-arrow-ratio);   filter: brightness(0); } .cmb__value--distance::after, .cmb__btn[aria-expanded="true"] .cmb__value--distance::after {   filter: brightness(100); } .cmb__value--distance .cmb__option-txt{   justify-content: center; } .cmb__select {   position: absolute;   top: 100%;   left: 0;   width: 100%;   border: 1px solid #caced1;   border-radius: 0.25em;   background-color: white;   list-style: none;   padding: 1em;   margin: 1em 0 0;   box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2); } .cmb__select::-webkit-scrollbar {   width: 7px; } .cmb__select::-webkit-scrollbar-track {   background: #f1f1f1;   border-radius: 25px; } .cmb__select::-webkit-scrollbar-thumb {   background: #ccc;   border-radius: 25px; } .cmb__option {   padding: 1em;   cursor: pointer;   display: flex;   gap: 0.5em;   align-items: center;   font-size: 1em; } .cmb__option--dense {   padding-top: 4px;   padding-bottom: 3px;   line-height: 2.5rem;   gap: 0; } .cmb__option.selected {   font-weight: 600; } .cmb__option.selected {   background-color: #f2f2f2;   border-radius: 4px; } .cmb__option .icon-choice {   filter: saturate(80%); } .cmb__option.selected .icon-choice {   filter: saturate(100%); } .cmb__select[aria-expanded="true"] .arrow {   transform: rotate(180deg); } .cmb__option:hover {   background-color: var(--blue-200);   border-radius: 4px; } .cmb__option:active {   background-color: var(--blue-100); } .cmb__box--ranking {   min-width: 30rem; } .cmb__options-emphasized {   margin: 0; }  html[lang="uk"] div.cmb__box--ranking, html[lang="bg"] div.cmb__box--ranking {   min-width: 35rem; }  html[lang="it"] div.cmb__box--ranking, html[lang="fr"] div.cmb__box--ranking, html[lang="es"] div.cmb__box--ranking, html[lang="el"] div.cmb__box--ranking, html[lang="tr"] div.cmb__box--ranking {   min-width: 33rem; }  html[lang="pl"] div.cmb__box--ranking, html[lang="ro"] div.cmb__box--ranking, html[lang="ar"] div.cmb__box--ranking {   min-width: 26rem; }  html[lang="de"] div.cmb__box--ranking, html[lang="ru"] div.cmb__box--ranking, html[lang="en"] div.cmb__box--ranking {   min-width: 29rem; } @media (max-width: 499.98px) {   .cmb__box--ranking {  width: 100%;  border-top: 2px solid var(--grey-600);  background: var(--blue-200);  min-width: unset;   }   .cmb .cmb__box.cmb__box--ranking {  min-width: unset;   }   .cmb__btn--ranking {  border-radius: 0;  min-width: unset;   }   .cmb__options--ranking {  box-shadow: var(--box-shadow-z3);  border: 2px solid var(--grey-500);  border-top: none;  border-radius: 0 0 2em 2em;  width: calc(100% + 2 * var(--gewichtung-border-stroke));  left: calc(-1 * var(--gewichtung-border-stroke));  margin-top: 0;   }   .icon-choice {  box-shadow: var(--box-shadow-z2);   } } .nav {   --icon-size: 2em; } .nav__items-container {   position: absolute;   background: hsl(0, 0%, 100%);   padding: 0.5em 2em 4em;   right: -2em;   top: 0em;   width: max-content;   display: grid;   row-gap: 2em;   box-shadow: var(--box-shadow-z3);   z-index: 9; } .nav__btn {   width: 2.6rem;   height: 2.6rem;   cursor: pointer; } .nav__close-btn {   font-size: var(--fs-s);   ;   justify-self: end; }  .nav__list {} .nav__li-item {   width: 100%;  padding-top: 1em;   padding-bottom: 1em; } .nav__item {   display: grid;   grid-template-columns: var(--icon-size) 1fr;   row-gap: 0.5em;   column-gap: 0.4em;   align-items: center;   text-decoration: none;   color: black;   font-size: var(--fs-m); } .nav__item-icon {   width: var(--icon-size);   height: var(--icon-size); } .nav__li-item--line {   border-top: 1px solid var(--grey-400);   margin-top: .5rem;   padding-top: 2rem; } html[lang='ar'] .gewichtung__li-item {   left: auto;   right: var(--move-item); } html[lang='ar'] .gewichtung__item {   right: auto;   left: var(--move-item); }  html[lang='ar'] .gewichtung__txt {   text-align: right; } html[lang='ar'] .cmb__value {   text-align: right; } html[lang='ar'] .cmb__option-txt {   direction: rtl;   text-align: right; } html[lang='ar'] .weighting__submit-icon {   rotate: 180deg; }  html[lang='ar'] #btn-to-top {   right: auto;   left: 1rem; } @media (min-width: 1500px) {   html[lang='ar'] #btn-to-top {  right: auto;  left: calc(50% - 75rem);   } } html[lang='ar'] .nav__items-container {   right: auto;   left: -2em; } html[lang='ar'] .passung__value-label-outer {   left: auto;   right: clamp(calc(0% + var(--prog-label-width) / 2), var(--passung-value), calc(100% - var(--prog-label-width) / 2) + 1rem); } html[lang='ar'] .passung__value-triangle {   left: auto;   right: clamp(calc(var(--prog-h) / 2), calc(var(--passung-value) - var(--prog-triangle-size)), 100%); } html[lang='ar'] .passung__value-label {   left: auto;   right: -50%;   direction: ltr; } html[lang='ar'] .back__link::before {   content: '→'; } html[lang='ar'] .details__content li, html[lang='ar'] .details__content p {   text-align: right; } html[lang='ar'] .details {   text-align: right; } html[lang='ar'] .back__link {   margin: 0; } html[lang='ar'] .back__wrapper {   padding: 0 clamp(1em, 2vw + 1rem, 5em); } html[lang='ar'] .details__title::after {   margin-left: 0;   margin-right: .75em; } html[lang='ar'] .tooltip__txt {   left: 0;   right: unset; } html[lang='ar'] .article .details div>ul {   list-style-type: disc;   margin: 0 0 2.4rem;   padding: 0.8rem 2rem 0 0; } html[lang="ar"] .l-intro__img-wrap::before {   right: unset;   left: 21%; } @media (max-width: 799.8px) {   html[lang='ar'] .cmb__options--language {  width: max-content;  right: unset;  left: 0   } } html[lang='ar'] .c-dialog {   left: unset;   right: 50%;  transform: translate(50%, -50%); }  @media (max-width: 499.8px) {   html[lang='ar'] .gewichtung__item::before {  left: unset;  right: calc(var(--pd-gewichtung) - var(--pd-before));   }   html[lang='ar'] .gewichtung__txt {  padding: 0 0.2em 0 var(--pd-gewichtung);  padding: 0 var(--pd-gewichtung) 0 0.2em;   } } html[lang="ar"] .hero__img-inner-wrap::before {   transform: scaleX(-1); } html[lang="ar"] .c-hero__heading {   padding-right: unset;   padding-left: 2rem; }  html[lang="ar"] .c-intro__block {   border-left: var(--intro-bd);   border-right: unset;   margin-right: 2em;   margin-left: 0; } html[lang="ar"] .c-intro__block:last-child {   border: 0;  } :root{   --dialog-min-gap: 2em; } .c-dialog {   position: fixed;   top: 50%;   left: 50%;   transform: translate(-50%, -50%);   border-radius: 2.5rem;   border: none;   padding: 1rem;   width: min(68rem, 90vw);   max-height: calc(100% - var(--dialog-min-gap)); } .c-dialog::backdrop {   background: rgba(0, 0, 0, 0.3); } .dialog__actions {   display: flex;   width: 100%;   justify-content: stretch;   margin-block-start: 0.5rem; } .dialog__actions button {   text-align: center;   flex: 1 1 0;   padding: 0.6rem 1rem;   min-inline-size: 0;   font-size: 2.4rem;   justify-content: center;   align-items: center; } .btn--cancel-dialogue {   border: 1px solid black;   background: white;   color: black; } .dialog__content {   padding: 4rem;   display: grid;   gap: 0.75rem;   grid-column: 1; } .dialog__actions {   display: flex;   margin-block-start: 0.5rem;   row-gap: 2rem;   column-gap: 3rem; } @media (max-width: 519.9px) {   .dialog__actions {  flex-direction: column;  align-items: stretch;   }   .dialog__actions .btn {  width: 100%;   } } body:has(.offers__dialog[open]) {   position: fixed;   inset: 0;   width: 100%;  top: var(--scrollPosition); } .c-dialog__scroll-container{   --sb-top: 0;   --sb-botton: calc(var(--dialog-min-gap));   max-height: calc(100vh - var(--sb-top) - var(--sb-botton));   overflow-y: scroll; }   :root {   --mx-l-w: 144rem;   --mg-lr-main: clamp(12px, calc(1.143px + 3.393vw), 50px);   --space-tb: 1rem; } html, body {   max-width: 100%;   overflow-x: hidden; } html {   display: flex;   flex-direction: column;   min-height: 100%; } body {   flex-grow: 1;   display: flex;   flex-direction: column;   min-height: 100%; } .l-main-stack {   flex-grow: 1;   display: flex;   flex-direction: column;   max-width: 140rem;   margin: 0 auto;   width: min(var(--mx-l-w), 100vw); } .l-main-inner, .l-footer-inner, .l-header-inner {   margin: 0rem var(--mg-lr-main) 0;   position: relative; } .l-header-inner {   display: flex;   justify-content: space-between;   align-items: center;   column-gap: 1rem;   position: relative; } .l-header {   padding: var(--space-tb) 0;   z-index: 9; } .l-header::after {   content: '';   height: var(--space-tb);   width: 100vw;   position: absolute;   right: 0;   box-shadow: 0 4px 4px -1px hsla(0, 0%, 0%, 0.37); } .l-header__logo {   flex-grow: 1;   display: flex; } .l-header__logo-img {   width: 19rem;   width: clamp(14rem, 81.82vi + -12.18rem, 23rem); } .l-header__logo-container {   flex-grow: 1; } .l-header__logo-btn.is-disabled {   cursor: unset; } .l-footer-inner {   display: flex;   justify-content: center;   gap: 1em;   flex-wrap: wrap;   width: 100%;   border-top: 1px solid hsl(0, 0%, 0%);   padding-top: 2rem;   margin-top: 2rem; } header, footer {   flex: 0 0;   width: min(var(--mx-l-w), 100vw);   margin-bottom: var(--space-tb); } .back__link {   font-size: var(--fs-s);   color: var(--grey-900);   margin: 0 var(--mg-lr-main);   text-decoration: none;   transition: all 0.2s; } .back__link::before {   content: '←';   margin-right: 5px;   position: relative;   transition: all 0.2s ease-in;   text-decoration: none; } .back__link:hover {   color: var(--grey-800); } .back__link:hover>span {   text-decoration: underline; } .back__link:active {   color: var(--grey-700); } .back__link:hover::before {   right: 3px;   font-weight: 500; } .back__link:active::before {   right: 0px; } main {   flex: 1 1;   margin: 4rem var(--mg-lr-main) 0;   width: min(var(--mx-l-w), 100vw);   position: relative; } #thesen_page:not(.hidden)~footer .l-footer-inner {   border-top: 0; } footer {   flex: 0 0;   display: flex;   gap: 2rem;   align-items: center;   text-align: center;   padding-bottom: 2rem;   background-color: #ffffff;   position: relative; } .p-3 footer::before {   content: '';   background: white;   width: 100vw;   position: absolute;   height: 100%;   z-index: 0;   bottom: 0;   transform: translateX(-50%);   left: 50%; } .footer__link {   margin: 0 1.5rem;   text-decoration: none;   color: black; } .footer__link:hover {   text-decoration: underline; } .to-top {   width: 6.6rem;   height: 6.6rem;   background-color: var(--grey-500); } .l-main--main-color {   background: linear-gradient(180deg, rgb(88, 76, 255) 42%, rgb(168, 162, 255) 100%); } .l-center-content {   display: grid;   place-content: center;   position: relative; } .copyright {   width: 100%;   color: var(--grey-600); }  .back__nav {   display: block; } .p-2 .back__nav, .p-3 .back__nav {   display: none; } :root{   --b-back-nav: calc(2 * var(--fs-s));   position: static; } .l-header{   margin-bottom: var(--b-back-nav); } .p-1, .p-2, .p-3{   --b-back-nav: 0; }  .back__nav {   position: static; } .back__wrapper {   position: absolute;   bottom: calc(var(--b-back-nav) * -1.5);   width: 100%;   display: flex;   justify-content: space-between;   align-items: center;   min-height: 3.5rem;   padding-right: clamp(1em, 2vw + 1rem, 5em); } .btn--print-icon {   display: block;   width: 35px;   height: auto; } .btn--print {   display: none;   cursor: pointer } .p-5 .btn--print, .p-6 .btn--print, .p-7 .btn--print {   display: block; } .back-slot {   position: relative; } .p-3::before {   background: url('../img/p1/e-5.svg');   background-position-x: center;   background-position-y: center;   background-repeat: no-repeat;   background-size: contain;   position: absolute;   content: '';   display: block;   width: clamp(12rem, 7.14vi + 9.71rem, 20rem);   aspect-ratio: 16/20;   right: 0;   z-index: 1; } :root {   --header-h: 4.25rem; } header.l-wrap {   height: var(--header-h);   background-color: white;   z-index: 6; } .l-header-inner {   z-index: 20; } .l-wrap.l-header::before {   height: calc(var(--header-h) + var(--space-tb));   display: block;   position: absolute;   top: 0;   right: 0;   content: '';   background: white;   width: 100vw; } .article {   --content-w: 70rem;   --title-h: 2.3em;   --title-imh-h: 5em;   --fs-title: 4rem;  --title-txt-bg: radial-gradient(ellipse farthest-side at center, hsl(244, 100%, 50%) 0%, hsla(244, 100%, 70%, 0.85) 100%); }  :root {   --title-bg: linear-gradient(180deg, rgba(88, 76, 255, 20%) 0%, rgba(88, 76, 255, 20%) 50%, rgba(255, 255, 255, 20%) 100%);   --title-bg-h: 33rem; } .article__title {   font-size: 1em;   position: relative;   z-index: 2;   background: var(--title-txt-bg);   padding: 0 1em;   min-height: var(--title-h);   display: flex;   align-items: center;   margin: 0;   border-radius: var(--fs-title);   text-align: center; } .article__title-container::before {   content: '';   position: absolute;   bottom: 0;   background: var(--title-bg);   width: 100vw;   height: var(--title-bg-h); }  @media (max-width: 419.8px) {   .article__title {  hyphens: auto;   } } @media (max-width: 1199.8px) {   .article {  --fs-title: 3.7rem;   } } @media (max-width: 899.8px) {   .article {  --fs-title: 3.5rem;   } } @media (max-width: 599.8px) {   .article {  --fs-title: 3.3rem;   } } @media (max-width: 399.8px) {   .article {  --fs-title: 3rem;   } }  .article__title--faq::before, .article__title--faq::after {   content: '?' / '';   padding: 0 1rem; } .article__title--faq::before {   transform: rotate(-25deg); } .article__title--faq::after {   transform: rotate(25deg); } .article__title-container {   width: 100%;   display: grid;   justify-content: center;   align-items: center;   color: white;   justify-items: center;   font-size: var(--fs-title);   position: relative; } .article__title-container>* {   grid-row: 1;   grid-column: 1;  } .article__title-img {   width: 70%;   height: var(--title-imh-h); }  .article__content-area {   max-width: var(--content-w);   display: flex;   flex-direction: column; } .article .fq-container {   width: 100%;   max-width: var(--content-w); } .article .l-main-inner {   position: relative;   display: flex;   justify-content: center; }  @media (max-width: 999.8px) {   .article .l-main-inner::after {  width: 100vw;   } } .article h2 {   font-size: var(--fs-l); } .article h3 {   font-size: var(--fs-m);  } .article h2, .article h3{   margin-block: 1.5em 0.5em;; } .article .details h3 {   font-size: var(--fs-m);   margin-block: 0; } .article .details>* {   padding-left: 1rem;   padding-right: 1rem; } .article p {   font-size: var(--fs-s);   margin-block: 0.5em; } .article li>p {   margin-block: 0.2em; } .article ul {   list-style-type: disc;   margin: 0 0 2.4rem;   padding: 0.8rem 0 0 2rem; }  .article li::marker {   font-size: 2em; } .article .details__summary h2 {   text-transform: uppercase; } .article .faq__list {   list-style: none;   padding-left: 0;   padding-right: 0;   --details-list-border: 3px solid var(--grey-500);   --details-list-bg: var(--grey-200); } .faq__list-item {   border-top: var(--details-list-border) } .faq__list-item:hover .details__summary, .faq__list-item:active .details__summary {   background: var(--details-list-bg); } .faq__list-item .details[open] .details__summary {   border-bottom: var(--details-list-border);   background: var(--details-list-bg);   color: var(--main-color); } .backlink {   display: flex;   flex-wrap: wrap;   gap: 2em;   margin: 2em 0; } .btn {   text-decoration: none;   border-radius: 0.5em;   padding: 0.1em 1em;   text-align: center;   cursor: pointer;   display: inline-flex;   justify-content: center;   align-items: center;   gap: 1em;   transition: all 0.2s ease;   background-color: var(--btn-bg-color);   --btn-hover-color: inherit;   --btn-active-color: inherit;   --btn-bg-color: inherit;   --btn-txt-color: black;   --btn-hover-txt-color: black;   --bd-color: none;   --btn-hover-tr: translateY(-2px);   --btn-active-tr: translateY(0px);   color: var(--btn-txt-color); } .btn:hover {   transform: var(--btn-hover-tr);   background: var(--btn-hover-color);   color: var(--btn-hover-txt-color); } .btn:active {   transform: var(--btn-active-tr);   background-color: var(--btn-active-color); } .btn--dense {   padding: 0.1em 0.4em;   border-radius: 7px; } .btn--big {   font-size: 3.8rem; } @media(max-width: 799.8px) {   .btn--big {  font-size: 2.4rem;   } } .btn--medium {   font-size: 2rem;   --btn-w: 3rem; } .btn--small {   font-size: var(--fs-xs); } .btn--main-color {   color: white;   box-shadow: var(--box-shadow-z1);   --btn-bg-color: var(--main-color);   --btn-hover-color: var(--blue-800);   --btn-active-color: var(--blue-400);   --btn-txt-color: white;   --btn-hover-txt-color: white;   border: 0; } .btn--grey {   border: 2px solid var(--grey-400);   --btn-bg-color: var(--grey-200);   --btn-hover-color: var(--grey-600);   --btn-active-color: var(--grey-100);   --btn-hover-txt-color: white;   --btn-hover-tr: none; } .btn--dark-grey {   border: 0;   --btn-bg-color: var(--grey-500);   --btn-hover-color: var(--grey-900);   --btn-active-color: var(--grey-400);   --btn-hover-txt-color: white;   --btn-txt-color: white;   --btn-hover-tr: none; } .btn--icon {   display: flex;   gap: 0.5em; } .btn--no-fill {   --bd-color: black;   border: 3px solid var(--bd-color);   width: 10em;   --btn-bg-color: white;   --btn-hover-color: var(--main-color);   --btn-active-color: var(--main-color);   --btn-hover-txt-color: white; } .btn--no-fill-grey {   --bd-color: var(--grey-400); } .l-btn--full-height {   display: flex;   height: 100%;   align-items: center;   justify-content: center; } .btn--semi-circle-left, .btn--semi-circle-right {   --btn-w: 4em;   width: var(--btn-w);   height: calc(var(--btn-w) * 2);   border: 2px solid var(--grey-400);   --btn-hover-color: var(--main-color);   --btn-active-color: var(--blue-400);   --btn-txt-color: black;   --btn-hover-txt-color: white; } .btn--semi-circle-left:hover::before, .btn--semi-circle-right:hover::before {   filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(7279%) hue-rotate(192deg) brightness(108%) contrast(94%); } .btn--semi-circle-left {   border-radius: var(--btn-w) 8px 8px var(--btn-w);   --btn-hover-tr: translateX(3px);   --btn-active-tr: translateX(4px); } .btn--semi-circle-right {   border-radius: 8px var(--btn-w) var(--btn-w) 8px;   --btn-hover-tr: translateX(-3px);   --btn-active-tr: translateX(-4px); } .btn__bg-icon {   --icon-path: url('../img/prev.svg'); } .btn__bg-icon--prev {   --icon-path: url('../img/next.svg');   --btn-hover-tr: translateX(-3px);   --btn-active-tr: translateX(-4px); } .btn__bg-icon--next {   --icon-path: url('../img/prev.svg');   --btn-hover-tr: translateX(3px);   --btn-active-tr: translateX(4px); } .btn__bg-icon::before {   content: var(--icon-path);   width: 100%; }  @media (hover: hover) and (pointer: fine) {   .btn--no-fill:hover {  border: 3px solid var(--main-color);   }   .btn--no-fill:active {  background-color: var(--main-color);  outline: 1px solid var(--grey-600);   }   .btn--no-fill {  transition: border-radius 0.3s ease, background-color 0.5s ease, color 0.5s ease, border 0.5s ease;   } }  @media (hover: none) and (pointer: coarse) {   .btn--no-fill:active {  background-color: var(--blue-500);  outline: 1px solid var(--grey-600);  color: white;   } } .btn--no-fill.is-pressed {   background-color: var(--blue-500);   outline: 1px solid var(--grey-600);   color: white; } @media (max-width: 1199.8px) {   .btn--no-fill {  --bd-color: transparent;  width: 10em;  background-color: white;  box-shadow: var(--box-shadow-z3);   } } .btn--round {   border-radius: 50%;   aspect-ratio: 1/1;   width: max-content; } .btn--main-color:hover {   transform: translateY(-2px);   background: var(--blue-800); } .btn--main-color:active {   transform: translateY(0px);   background-color: var(--blue-400); } #btn-to-top {   position: fixed;   bottom: 6rem;   right: 1rem;   display: none;   padding: 1rem 1.5rem;   font-size: var(--fs-xs);   background-color: var(--grey-700);   color: white;   border: none;   border-radius: 5px;   cursor: pointer;   transition: background-color 0.3s ease;   z-index: 9;   background-image: url('../img/to-top.svg');   background-position: center;   background-repeat: no-repeat;   background-size: 65%;   width: Min(5rem, 4vw);   aspect-ratio: 1/1; }  @media (min-width: 1499.8px) {   #btn-to-top {  right: calc(50% - 75rem);   } }  #btn-to-top:hover {   background-color: var(--grey-900); }  .btn--medium-return-to-gewichtung {   display: block;   margin-bottom: 2em;   margin-top: 1em; } .btn__toggle-play {   display: flex;   justify-content: center;   align-items: center;   width: 4rem;   height: 4rem;   border: none;   border-radius: 50%;   cursor: pointer;   overflow: hidden;   transition: background-color 200ms ease;   position: relative;   margin: 0 1rem 1rem 0;   border: 2px solid var(--grey-500);   --btn-hover-tr: 0;   --btn-hover-color: var(--main-color);   --btn-active-color: var(--blue-600);   --btn-bg-color: inherit;   --btn-txt-color: black;   --btn-hover-txt-color: black; } .btn__toggle-play--icon-play, .btn__toggle-play--icon-pause {   display: grid;   justify-content: center;   align-items: center;   grid-row: 1;   grid-column: 1;   width: 90%;   height: 90%;   opacity: 0; } .btn__toggle-play--icon-pause>svg, .btn__toggle-play--icon-play>svg {   width: 100%;   height: 100%; } .btn__toggle-play {   display: grid;   justify-content: center;   align-items: center; } .btn__toggle-play--play .btn__toggle-play--icon-play {   opacity: 1; } .btn__toggle-play--pause .btn__toggle-play--icon-pause {   opacity: 1; } .btn__toggle-play:hover .cls-1, .btn__toggle-play:active .cls-1 {   fill: white } .btn__angebot {   padding: 0; } @media (max-width:899.8px) {   .btn__toggle-play--icon-play,   .btn__toggle-play--icon-pause {  width: 70%;  height: 70%;   } } .details {   width: 100%;   text-align: left;   --details-pd-lr: 0em;   --details-pd-ou: 0.5em;   --sum-arrow-w: 1.3em;   --sum-arrow-ratio: 23 / 11;   cursor: default; }  .details__summary {   display: flex;   position: relative;   justify-content: start; } .details__summary--arrow-left {   max-width: max-content; } .details[open] .details__summary {   height: max-content !important; } @media (min-width: 600px) {   .details__summary--arrow-left-desktop {  max-width: max-content;   } } .details__title {   padding: var(--details-pd-ou) var(--details-pd-lr);   width: 100%;   font-size: 1.75em;   word-wrap: anywhere;   display: flex;   align-items: baseline;   justify-content: space-between; } .details__content {   padding-left: var(--details-pd-lr);   padding-right: var(--details-pd-lr); } .details__content--with-list ul {   padding-inline-start: 2rem; } .details__title--arrow-left::after {   right: unset;   top: unset;   position: relative; } .details__title--arrow-left {   display: inline-flex;   align-items: baseline;   justify-content: start;   --sum-arrow-w: 1em; } .details__title--no-arrow {   display: inline;   --sum-arrow-w: 0;   max-width: max-content;   } .details__summary:hover .details__title.details__title--no-arrow {   color: black; } .details__title--no-arrow::after {   right: unset;   top: unset;   position: relative;   content: ''; }  .details__title--col-main {   color: var(--main-color); } .details--pd-card {   --details-pd-lr: var(--card-mg-lr); } .details__title::after {   content: '';   width: var(--sum-arrow-w);   background: url('../img/collapse.svg');   background-size: cover;   margin-left: .75em;   transition: 0.2s;   flex-shrink: 0;   aspect-ratio: var(--sum-arrow-ratio);   transform: scale(1);   transition: transform 0.2s ease;   filter: brightness(0);   rotate: 180deg; } .details[open]>.details__summary>.details__title::after {   rotate: 0deg; } .details__title--col-main::after {   filter: unset; } .details__summary:hover .details__title {   color: var(--main-color); } .details__summary:hover .details__title--col-main {   color: black; } .details__summary:hover .details__title::after {   transform: scale(1.2);   filter: unset; } .details__summary:hover .details__title--col-main::after {   filter: brightness(0); } .details--bd-bt {   border-bottom: 2px solid var(--grey-400); } .details--bd-bt[open] {   border: 0; } .details--disabled .details__title::after{   content: none;  } .details--disabled {   cursor: default; } .details--disabled[open].details--bd-bt{   border-bottom: 2px solid var(--grey-400); } .details--disabled:hover .details__title {   color: black; } :root {   --anz-bdr: 2.8rem;   --mg-block: 6rem; } .anzeige-angebot__offer {   background-color: var(--blue-100); } .anzeige-intro {   display: grid;   grid-template-columns: 1fr 1fr;   row-gap: 2rem;   column-gap: 1rem;   margin-bottom: var(--mg-block); } .anzeige-intro>* {   z-index: 1; } .anzeige-intro__heading {   grid-row: 1;   grid-column: 1;   margin: 0;   align-self: end; } .anzeige-intro__txt {   grid-row: 2;   grid-column: 1;   align-self: start; } .anzeige-intro__img-wrapper {   grid-row: 1/3;   grid-column: 2; } .anzeige-intro__img {   border-top-left-radius: var(--anz-bdr);   border-top-right-radius: var(--anz-bdr); } .anzeige-info {   --mg-left: clamp(4rem, 14.71vi + -12.18rem, 9rem);   display: grid;   grid-template-columns: var(--mg-left) 1fr;   margin-bottom: var(--mg-block); } .anzeige-info__img-wrap {   width: var(--mg-left);   position: relative;   grid-row: 1/ 3;   display: flex;   align-items: start;   justify-content: end;   height: calc(100% + 4rem);   align-self: end; } .anzeige-info__img-wrap::before {   background: url('../img/p1/e-2.svg');   background-repeat: no-repeat;   position: absolute;   content: '';   background-position: center;   background-size: contain;   display: block;   aspect-ratio: 1/1;   right: 21%;   height: 23rem;   height: clamp(14.38rem, 55.83vi + -17.03rem, 22.75rem); } .anzeige-info__list {   list-style: none;   display: flex;   flex-direction: column;   gap: 2rem; } .anzeige-info__list-item {   box-shadow: var(--box-shadow-z2);   border-radius: 2.8rem;   border: 2px solid var(--grey-300);   padding: 2rem;   border-radius: var(--anz-bdr);   display: flex;   align-items: center;   gap: 2rem;   --l-icon-fs: 2rem;   --l-icon-pd: 0.2rem;   --l-icon-s: calc(2 * var(--l-icon-fs) + var(--l-icon-pd)); } .anzeige-info__list-item>p {   font-size: 1em;   align-self: center; } .anzeige-info__list-item::before {   content: '✔';   font-size: var(--l-icon-fs);   color: white;   background-color: var(--main-color);   border-radius: 50%;   flex-shrink: 0;   display: flex;   justify-content: center;   align-items: center;   position: relative;   width: var(--l-icon-s);   height: var(--l-icon-s);   padding: var(--l-icon-pd); } .anzeige-kontakt {   display: grid;   grid-template-columns: 1fr 1fr;   margin-bottom: var(--mg-block);   column-gap: 4rem; } .anzeige-kontakt__img-wrapper {   grid-row: 1/3;   grid-column: 1; } .anzeige-kontakt__img {   border-radius: var(--anz-bdr); } .anzeige-kontakt__heading {   font-size: var(--fs-xl);   grid-row: 1;   grid-column: 2;   align-self: end; } .anzeige-kontakt__info {   grid-row: 2;   grid-column: 2;   align-self: start; } .anzeige-kontakt__list {   list-style: none;   --img-size: 1.4em; } .anzeige-kontakt__list-item::before {   content: '';   background-color: var(--main-color);   border-radius: 50%;   aspect-ratio: 1/1;   position: relative;   height: var(--img-size);   width: var(--img-size);   margin-right: 0.4em;   background-size: 70%;   background-repeat: no-repeat;   background-position: center; } .anzeige-kontakt__list-item--tel::before {   background-image: url('../img/icon_tel.svg'); } .anzeige-kontakt__list-item--mail::before {   background-image: url('../img/icon_mail.svg'); } .anzeige-kontakt__list-item--web::before {   background-image: url('../img/icon_web.svg'); } .anzeige-kontakt__list-item {   margin-top: 0.4em;   display: flex; } .anzeige-angebot {   display: grid;   column-gap: 4rem;   background-color: var(--blue-100);   border-radius: var(--anz-bdr);   margin-bottom: var(--mg-block);   padding: 4rem;   margin: 0; } .anzeige-angebot__img-wrapper {   grid-row: 1/3;   grid-column: 1; } .anzeige-angebot__heading {   grid-row: 1;   grid-column: 2;   align-self: end; } .anzeige-angebot__txt {   grid-row: 2;   grid-column: 2;   align-self: start; }  @media (max-width: 1199.8px) {   .anzeige-intro__heading {  font-size: 5rem;   }   .anzeige-intro__txt,   .anzeige-kontakt__info-heading,   .anzeige-info__list-item,   .anzeige-angebot__txt,   .anzeige-kontakt__list-item {  font-size: var(--fs-m);   } }  @media (max-width: 899.8px) {   :root {  --anz-bdr: 1.8rem;  --mg-block: clamp(2rem, 7.27vi + -0.55rem, 6rem);   }   .anzeige-intro__txt,   .anzeige-info__list-item,   .anzeige-angebot__txt,   .anzeige-kontakt__list-item {  font-size: var(--fs-s);   }   .anzeige-kontakt__heading, .anzeige-kontakt__info{  margin: 0 var(--anz-bdr);   } .anzeige-intro__heading {  font-size: var(--fs-xl);   }   .anzeige-kontakt__heading, .anzeige-angebot__heading {  font-size: var(--fs-l);   }   .anzeige-intro {  grid-template-columns: 1fr;   }   .anzeige-intro__heading {  grid-row: 1;  grid-column: 1;  margin: 0;  align-self: center;   }   .anzeige-intro__txt {  grid-row: 2;  grid-column: 1;  align-self: center;   }   .anzeige-intro__img-wrapper {  grid-row: 3;  grid-column: 1;   }   .anzeige-info {  grid-template-columns: 1fr;   }   .anzeige-info__list-item {  align-items: start;   }   .anzeige-info__img-wrap {  display: none;   }   .anzeige-kontakt {  display: grid;  grid-template-columns: 1fr;  margin-bottom: var(--mg-block);  column-gap: 4rem;  row-gap: 1rem;   }   .anzeige-kontakt__img-wrapper {  grid-row: 1;  grid-column: 1; }   .anzeige-kontakt__heading {  grid-row: 2;  grid-column: 1;  align-self: end;   }   .anzeige-kontakt__info {  grid-row: 3;  grid-column: 1;  align-self: start;   }   .anzeige-angebot {  justify-items: center;   }   .anzeige-angebot__img-wrapper {  grid-row: 1;  grid-column: 1;  max-width: Max(39%, 15rem);  margin-bottom: 1rem;   }   .anzeige-angebot__heading {  grid-row: 2;  grid-column: 1;   }   .anzeige-angebot__txt {  grid-row: 3;  grid-column: 1;  text-align: center;   } }